<template>
  <template v-for="menu in menus" :key="menu.componentName">
    <el-menu-item v-if="!menu.children || menu.children.length === 0" :index="menu.componentName">
      <span>{{ menu.name }}</span>
    </el-menu-item>
    <el-sub-menu v-else :index="menu.componentName">
      <template #title>
        <span>{{ menu.name }}</span>
      </template>
      <RecursiveMenu :menus="menu.children" />
    </el-sub-menu>
  </template>
</template>




<script>
export default {
  name: 'RecursiveMenu',
  props: {
    menus: {
      type: Array,
      required: true
    }
  },
  created() {
    // console.log('【RecursiveMenu 创建】传入的菜单数据:', this.menus);
  },
  mounted() {
    // console.log('【RecursiveMenu 挂载】组件已挂载');
  }
};
</script>


  